Direct Manipulation: A Step Beyond Programming Languages
Ben Shneiderman, Direct Manipulation: A Step Beyond Programming Languages, The New Media Reader, The MIT Press, 2003, pp.485–498 Ben Shneiderman, New MediDirect Manipulation: A Step Beyond Programming Languages, Computer, Volume 16, Issue 8, August 1983, pp 57–69
Introduction (pp 485)
直接操作とは、オブジェクトやデータを直接操作してコンピュータシステムと相互作用する概念のことである。 コマンドベースの言語に依存する従来のプログラミングとは異なり、直接操作では、実行される各アクションに対して瞬時に視覚的なフィードバックを提供するグラフィカルインタフェースが採用されている。
シュナイダーマンの概念は、1983年のエッセイで言及されたソフトウェアアプリケーションだけでなく、グラフィカルユーザーインタフェース、ビジュアルプログラミング、およびその他のインタフェースも含んでいる。 直接操作の有効性は、Photoshop のようなグラフィック処理ツールの進歩によって証明されている。 しかし、シュナイダーマンの述べた通り、直接操作を採用した特定のインターフェースに熟練度を身につけるためには、まだコマンド言語を学ぶのと同等の時間と労力が必要だ。
Direct manipulation refers to the concept of interacting with a computer system by directly manipulating objects or data. Unlike traditional programming, which relies on command-based languages, direct manipulation employs a graphical interface that provides instant visual feedback for each action performed.
Shneiderman's concepts encompass not only the software applications mentioned in his 1983 essay, but also encompass graphical user interfaces (GUI), visual programming, and other interfaces. The effectiveness of direct manipulation methods has been demonstrated through the advancement of graphics processing tools like Photoshop. However, as per Shneiderman's statement, it is still required to invest time in acquiring proficiency in certain interfaces that employ direct manipulation, which is equivalent to learning a command language.
Example of Direct Manipulation Systems (pp 486-492)
著者はいくつかの原則からなる、同じ喜び体験を生み出すことができる特徴のモデルを定義する:
対象物の可視性
迅速、可逆的、増分的なアクション
複雑なコマンド言語の置き換え
上記の要件をすべて満たすシステムはないが、著者はユーザーから大きな熱意を受けたいくつかのシステムの例を提供する。
The author defines a model of features that can produce the same delight experience, consisting of following principles:
Visibility of the Object of Interest:
Rapid, Reversible, Incremental Actions:
Replacement of Complex Command Language:
Even though there is no system that meets all of the above requirements, the author provides examples of some systems that have received great enthusiasm from their users.
Display Editors (pp 486-487)
ディスプレイエディタは、使いやすい機能がたくさんあるため人気がある。 一度にたくさんのテキスト(24~66行)が表示されるため、文書を読みやすく理解しやすくなる。 一度に 1 行しか表示されない行エディタとは異なり、ディスプレイエディタでは、印刷時にドキュメントが表示されるため、表や見出しなどのさまざまな書式要素を使用して作業するのが簡単だ。
矢印や点滅するボックスのような可視的なカーソルがあり、ドキュメント内で作業している場所が明確になる。 マウスや矢印キーなどのデバイスのおかげで、文書の移動も簡単だ。 一般的なコマンド(INSERTやDELETEなど)でラベル付けされたボタンがあるため、複雑なコマンドを覚える必要はない。 テキストの移動や削除などの変更は、すぐに画面に表示される。
これらのエディタはあなたの行動に素早く反応する。 ミスをすると、バックスペースやUNDOオプションのような簡単なコマンドで簡単に修正できる。 さらに、ディスプレイエディタは非常に人気があるため、彼らの間には多くの競争があり、それが彼らをますます向上させる要因となっている。
Display editors are popular because they have a lot of user-friendly features. They show a lot of text at once (24 to 66 lines), so it's easier to read and understand documents. Unlike line editors that show only one line at a time, display editors let you see the document as it will look when printed, making it easier to work with different formatting elements like tables and headings.
They have visible cursors, like arrows or blinking boxes, which make it clear where you're working in the document. Moving around the document is easy too, thanks to devices like mouse or arrow keys. They have buttons labeled with common commands (like INSERT or DELETE), so you don't have to remember complicated commands. Any changes you make, like moving text or deleting, show up on the screen right away.
These editors are fast, responding quickly to your actions. If you make a mistake, it's easy to fix with simple commands like backspacing or an UNDO option. Plus, because display editors are so popular, there's a lot of competition among them, which means they keep getting better and better.
VisiCalc (pp 487)
VisiCalcは、ハーバード大学MBAの学生によって開発された、VisiCorpによる画期的な財務予測ツールだった。 複雑な計算が容易になり、254 行と 63 列の大きなグリッドで作業できる。 ユーザーは、一部のカラムの変更によって他のカラムの合計が自動的に更新されるように設定できる。 これは特にコスト、売上、利益などを追跡し、変化が利益にどのような影響を及ぼすかを示すのに有用だった。プログラムは会計士のワークシートのように見え、初心者にも分かりやすかった。 一度に大量のデータが表示され、ワークシートのさまざまな部分を管理する機能があった。 VisiCalc, developed by a Harvard MBA student, was a groundbreaking financial forecasting tool by VisiCorp. It made complex calculations easy, letting users work with a large grid of 254 rows and 63 columns. Users could set it up so changes in some columns automatically updated totals in others. This was especially useful for tracking things like costs, sales, and profits, showing how changes affected profits right away. The program looked like an accountant's worksheet, so it was easy for beginners to understand. It showed a good amount of data at once and had features for managing different parts of the worksheet. Spatial Data Management (pp 488)
Nicholas Negroponteにインスパイアされたプロトタイプ空間データ管理システムは、ユーザーが視覚的かつ楽しい方法でデータと対話できるようにする。 例えば、ユーザーはスクリーン上の世界地図を見て拡大することで、太平洋における船の位置などの具体的な詳細を見ることができる。 ジョイスティックを動かすことで、各船の構造や船長の写真まで見ることができる。 同様に、企業環境では、ユーザーはフロアプランでさまざまな部門やオフィスを探索することができ、より詳細な情報を得るために特定の部屋に潜る。 間違った選択をした場合、簡単に戻って別の選択肢を選ぶことができる。 The prototype spatial data management system, inspired by Nicholas Negroponte, lets users interact with data in a visual and fun way. For example, users can look at a world map on a screen and zoom in to see specific details like ship locations in the Pacific Ocean. They can go further to see each ship's structure or even a picture of the ship's captain, all by moving a joystick. Similarly, in a corporate setting, users can explore different departments and offices on a floor plan, diving into specific rooms for more details. If they make a wrong choice, they can easily go back and choose another option. Video Games (pp 488-490)
ビデオゲームは、インタラクティブシステムを楽しく使いやすくするための完璧な例である。 Pongのような初期のゲームは単純で、ノブを動かすだけで遊ぶことできた。 スペースインベーダーやドンキーコングのような現代のゲームは、より良いグラフィックとサウンドでより複雑だが、それでも簡単に学ぶことができる。プレイヤーは他のプレイヤーやデモンストレーションを見ればすぐに遊び方を理解でき、操作もボタンを押したりジョイスティックを動かしたりするだけの簡単なものだ。覚えなければならない複雑なルールもなく、間違えてもやったことを元に戻せばいいだけだ。
ゲームはスコアを記録し、これによりプレーヤーは自分の実力を見ることができ、向上するモチベーションが生まれる。 シンプルで楽しいものにするためのこのアプローチは、オフィスコンピュータなどの他の分野で使用することができ、脅威を軽減して使いやすくなる。
Video games are a perfect example of how to make interactive systems fun and easy to use. Early games like Pong were simple; you just moved a knob to play. Modern games, such as Space invader and Donkey Kong, are more complex with better graphics and sound, but still easy to learn. Players quickly understand how to play by watching others or demonstrations, and controls are straightforward, like pressing buttons or moving a joystick. There are no complicated rules to remember, and if you make a mistake, you just reverse what you did. Games keep scores, which helps players see how they are doing and motivates them to get better. This approach to making things simple and enjoyable can be used in other areas like office computers to make them less intimidating and more user-friendly.
Computer-Aided Design/Manufacturing (pp 490-491)
コンピュータ支援設計と製造システムにより、自動車、電子機器、建物のレイアウトなどの設計が容易になる。 ユーザーは画面上で計画を見ることができ、ライトペンなどのツールを使用して部品を移動することができる。 これらのシステムはまた、コストや設計上の問題などの有用な情報も提供する。これらのシステムの中には、覚えやすい簡単なコマンドがあるものもあり、特に石油精製や発電などの業界で便利だ。 そこで、オペレータはプラントの図を見ることができ、複雑な手順を記憶する必要なく、いくつかのボタンを押すことで問題を迅速に発見して修正できる。 これにより、複雑なシステムの管理がはるかに簡単で直感的になる。
Computer-aided design and manufacturing systems make designing things like cars, electronics, and building layouts easier. Users can see a plan on a screen and use tools like a lightpen to move parts around. These systems also give helpful information like costs and possible issues with the design. Some of these systems have simple commands that are easy to remember, which is especially useful in industries like oil refining or power generation. There, operators can see a diagram of the plant and quickly find and fix problems by pressing a few buttons, without needing to remember complicated steps. This makes managing complex systems much simpler and more intuitive.
Further Examples (pp 491-492)
著者が直接操作の例として定義するのは、ハンドルを介して直接動きを制御する車を運転するようなものである。 この方法は、ロボットの手を操作者が案内し、自動反復のために動作を記録するプログラミングロボットにも使用される。 データ管理では、Query-by-Exampleのような方法でユーザーが対話的にデータを入力して結果を見ることができ、初心者には簡単で、専門家には強力である。
Xerox Star、AppleのLisa、IBMのPictureworldなどの先進的なオフィスシステムは、直感的な操作にグラフィカルアイコンを使用しているため、印刷やファイリングなどの作業が簡単になる。 教育では、直接操作することで、学生が科学実験やシミュレーションなどの活動に直接参加できる教育プログラムで見られるように、よりインタラクティブな学習が可能になり、学習体験を向上させる。
The author define example of direct manipulation is like driving a car where you directly control the movement through the steering wheel. This approach is also used in programming robots, where the operator guides the robot's hand and the actions are recorded for automatic repetition. In data management, methods like Query-by-Example allow users to interactively enter data and see results, which is easy for beginners and powerful for experts. Advanced office systems like the Xerox Star, Apple Lisa, and IBM's Pictureworld use graphical icons for intuitive operations, making tasks like printing and filing straightforward. In education, direct manipulation makes learning more interactive, as seen in educational programs where students can directly engage in activities like scientific experiments or simulations, enhancing the learning experience. Explanation of Direct Manipulation (pp 492- 496)
複数の専門家が、技術における直接操作を理解するのに貢献している。 IBMのDon Hatfield氏は、オフィスシステムの開発に使用するこのアプローチを説明するために、「見えるものが得られるもの」というフレーズを作った。 Harold Thimblebyはこのアイデアを拡張し、ディスプレイがシステムのステータス、エラー、および利用可能なアクションを明確に示すべきであることを示唆した。 Ted Nelsonは、仮想現実の操作を可能にするインターフェースに対するユーザーの興奮に注目した。一方、Rutkowskiの「透明性」という概念は、ツールがバックグラウンドでフェードされ、ユーザーがタスクに集中できることを意味する。 MacDonaldは、プログラマ以外の人が簡単にアプリケーションを作成または変更できるようにする「ビジュアルプログラミング」を提案した。 これらすべてのアイデアは、インタラクティブシステムの進化する性質とユーザーフレンドリーなデザインの重要性を強調している。 Several experts have contributed to understanding direct manipulation in technology. Don Hatfield of IBM coined the phrase "What you see is what you get" to describe this approach, which he uses in developing office systems. Harold Thimbleby expanded this idea, suggesting that displays should clearly show the system's status, errors, and available actions. Ted Nelson noted the user excitement for interfaces that allow manipulation of a virtual reality, while Rutkowski's concept of "transparency" means the tool fades into the background, letting users focus on the task. MacDonald proposed "visual programming" to help non-programmers easily create or modify applications. All these ideas highlight the evolving nature of interactive systems and the importance of user-friendly design. Problem-Solving and Learning Research (pp 492-493)
視覚的または物理的な表現を使用することで、問題解決と学習がより効果的になる。 Polyaが提案したように、数学問題の絵を描いたり、モンテッソーリの方法のように数学を教えるためにオブジェクトを使うことは、人々がよりよく理解し記憶するのに役立る。 研究はこれを裏付けており、例えば幾何学におけるダイアグラムが単なる公式よりも有用であることを示している。 ロゴプログラミング言語は、この概念を教育に適用し、生徒が線画を作成することで幾何学を視覚的に学習できるようにする。これにより、理解が容易になり、エラー修正が簡単になり、学習の魅力が高まる。
Using visual or physical representations makes problem-solving and learning more effective. Drawing pictures for math problems, as suggested by Polya, or using objects for teaching math, like Montessori's method, helps people understand and remember better. Research supports this, showing that diagrams in geometry, for example, are more helpful than just formulas. The Logo programming language applies this concept in education, allowing students to visually learn geometry by creating line drawings, which makes understanding easier, error correction simpler, and learning more engaging.
Problem with Direct Manipulation (pp 493)
フローチャートのように、プログラミングでグラフィック表現を使用することは役に立つが、課題ももたらす。 これらのグラフィックスのルールを学習するには、余分な労力が必要になることがある。また、コードだけを使用する場合と比較して、理解や問題解決が必ずしも向上するとは限らない。 これらのグラフィックのアイコンは、特に国際的な文脈では必ずしもそうではないが、明確で分かりやすいものである必要がある。
また、これらのグラフィックスによって、どのようなアクションが可能かについてユーザが誤解するおそれもある。 もう一つの問題は、画面スペースを多く取ることができるという点だ。これは、コンパクトな形式でより多くの情報を好む経験豊富なユーザーには効率的でない可能性がある。 適切な種類のグラフィックスとその使用方法を選択するのは難しい場合がある。混乱を避けるために、それらをシンプルに保つことが重要である。 最後に、ユーザーはこれらのグラフィックスを異なる解釈で解釈する場合があるため、意図したとおりに動作するかどうかをユーザーと徹底的にテストすることが重要である。
Using graphic representations in programming, like flowcharts, can be helpful but also brings challenges. Learning the rules of these graphics can take extra effort, and sometimes they don't always improve understanding or problem-solving compared to just using code. Icons in these graphics need to be clear and easy to understand, which isn't always the case, especially in international contexts.
There's also a risk that these graphics might mislead users about what actions are possible. Another issue is that they can take up a lot of screen space, which might not be efficient for experienced users who prefer more information in a compact form. Choosing the right kind of graphics and how they're used can be tricky, and it's important to keep them simple to avoid confusion. Finally, because users might interpret these graphics differently, it's crucial to test them thoroughly with users to ensure they work as intended.
The Syntactic/Semantic Model (pp 493-495)
直接操作の主な特徴としては、常に目に見える対象、マウスやタッチスクリーンなどのデバイスを使用した簡単な相互作用、迅速かつ可逆的な変更、シンプルなレベルから高度なレベルへと成長する学習アプローチなどがある。 これらの機能により、初心者でも簡単に学習でき、専門家は効率的に作業できるようになり、断続的なユーザーがシステムの使い方を覚えるのに役立る。 また、エラーメッセージの必要性を減らし、ユーザーの不安を軽減し、ユーザーがコントロールできると感じるようにする。 著者の観点から、直接操作の有効性は、認知心理学からの構文/意味モデルによって説明されている。このモデルは、知識を構文と意味論の2つのタイプに分離する。
テキスト エディタの構文知識には、項目区切り文字(スペース、カンマ)やキーストロークなどの特定のコマンドを記憶して、改行を挿入したり文字を削除したりすることが含まれる。 この知識はシステム固有のものであり、ローテーションによって学習され、頻繁に使用されない場合は忘れられやすく、異なるシステム間で重複する可能性がある。
テキストエディタを使用する文脈におけるセマンティック知識には、システムの概念または機能を理解することが含まれる。 この知識は、カーソルの移動、挿入、削除などの基本的な機能(下位レベル)から、スペルミスを修正したり、ある段落から別の段落に文を移動したりするなどのより複雑なプロセス(上位レベル)まで階層的に構造化されている。 意味の知識は説明を通じて得られ、身近な概念と結びつき、記憶力がより安定する。
Key features of direct manipulation include always visible objects of interest, easy interactions using devices like mouse or touchscreens, quick and reversible changes, and a learning approach that grows from simple to advanced levels. These features make it easy for beginners to learn, allow experts to work efficiently, and help intermittent users remember how to use the system. They also reduce the need for error messages, lower user anxiety, and make users feel in control. From the author point of view, the effectiveness of direct manipulation is explained by the syntactic/semantic model from cognitive psychology, which separates knowledge into two types: syntactic and semantic.
Syntactic knowledge in a text editor involves memorizing specific commands, such as item delimiters (space, comma) or keystrokes for actions like inserting a new line or deleting a character. This knowledge is system-specific, learned by rote, and easily forgotten if not frequently used, with some overlap possible between different systems.
Semantic knowledge in the context of using a text editor involves understanding the concepts or functionality of the system. This knowledge is structured hierarchically, from basic functions like cursor movement, insertion, and deletion (lower level) to more complex processes like correcting a misspelling or moving a sentence from one paragraph to another (higher level). Semantic knowledge is gained through explanations and linked to familiar concepts, making it more stable in memory.
Implication of the Syntactic/Semantic Model (pp 495-496)
構文/意味モデルは、ユーザーがテキストエディタなどのシステムとどのように相互作用するかを説明する。 初心者は特定のコマンド(構文)を学習することに重点を置いているが、経験豊富なユーザーはアクション(セマンティクス)の背後にある概念についてより多く考える。 トレーニング資料は、特定のコマンドと構文を導入する前に、高度な問題解決アプローチから始める必要がある。 直接操作は、ユーザーが高いレベルのタスクに直接対応するアクションを実行できるようにすることで、このモデルと連携し、システムをより直感的にして認知負荷を軽減する。
The syntactic/semantic model explains how users interact with systems like text editors. Novices focus on learning specific commands (syntax), while experienced users think more about the concepts behind actions (semantics). Training materials should begin with high-level problem-solving approaches before introducing specific commands and syntax. Direct manipulation aligns with this model by allowing users to perform actions that directly correspond to high-level tasks, making systems more intuitive and reducing cognitive load.
Potential Applications of Direct Manipulation (pp 496-498)
直接操作には、直感的で視覚的なタスク表現を作成することが含まれ、タスクの理解と使用が容易になる。 この段落では、アドレス管理用のデジタル Rolodex、ビジュアルレジスタによるチェックブックのメンテナンス、インデックスカードの仮想カタログによる書誌検索など、さまざまな革新的な例を説明する。 また、ビジュアルファイルディレクトリがあるジョブ制御言語、マップとカレンダーを使用した航空会社予約、またはビジュアルインベントリシステムなど、物理的な類似性のない環境に直接操作を適用することも提案している。
直接操作の主な利点は、その包括性、自然な相互作用、迅速な対応、およびユーザーの楽しみである。 従来は複雑なコマンドが必要だったタスクをシンプル化し、学習時間を短縮し、ユーザー満足度を高める。 直接操作の未来は有望に見える。退屈な作業を魅力的な経験に変えることができるため、学術研究と商業製品開発の両方でこのアプローチを改良し探求することへの関心が高まっている。
Direct manipulation involves creating intuitive, visual representations of tasks, making them easier to understand and use. The paragraph describes various innovative examples, such as a digital Rolodex for address management, checkbook maintenance with a visual register, and bibliographic searching with a virtual catalog of index cards. It also suggests applying direct manipulation to environments without physical parallels, like job control languages with visual file directories, making airline reservations using maps and calendars, or visual inventory systems.
The key advantages of direct manipulation are its comprehensibility, natural interaction, rapid response, and enjoyment for the user. It simplifies tasks that traditionally required complex commands, reducing learning time and increasing user satisfaction. The future of direct manipulation looks promising, as it can transform tedious tasks into engaging experiences, and there's growing interest in refining and exploring this approach in both academic research and commercial product development.